<template>
  <div>
    <a-modal
      :title="this.title"
      :visible="this.visible"
      :width="660"
      @cancel="cancel"
      @ok="ok"
    >
      <a-tabs type="card"  >
        <a-tab-pane key="2" tab="评估任务"   force-render>
          <a-form
            :form="form2"
            v-bind="formItemLayout"
          >
<!--            <a-form-item label="需求名称">-->
<!--              <a-input :value="this.demandName" readOnly-->
<!--              />-->
<!--            </a-form-item>-->
            <a-form-item label="任务名称">
              <a-input
                v-decorator="this.validator1.name"
              />
            </a-form-item>
            <a-form-item label="任务描述">
              <a-input
                v-decorator="this.validator1.taskdes"
              />
            </a-form-item>

            <a-form-item label="评估任务类型">
              <a-select @change="handleChange"
                v-decorator="this.validator1.taskClassify">
                <a-select-option value="数据">
                  数据
                </a-select-option>
                <a-select-option value="应用">
                  应用
                </a-select-option>
                <a-select-option value="服务">
                  服务
                </a-select-option>
              </a-select>
            </a-form-item>
            <a-form-item label="数据"  v-if="this.taskType==='数据'">
              <a-upload
                name="file"
                :action="estimateFileAction"
                :headers="headers"
                @change="handleUploadChange"
                :showUploadList="false"
                :data="uploadParam"
                v-decorator="this.validator1.uploadData"
              >
                <a-button> <a-icon type="upload" /> 选择文件 </a-button>
              </a-upload>
            </a-form-item>
            <a-form-item label="应用" v-if="this.taskType==='应用'">
              <a-upload
                name="file"
                :headers="headers"
                :action="estimateFileAction"
                @change="handleUploadChange"
                :showUploadList="false"
                :data="uploadParam"
                v-decorator="this.validator1.uploadApplication"
              >
                <a-button> <a-icon type="upload" /> 选择文件 </a-button>
              </a-upload>
            </a-form-item>
<!--            <a-form-item label="服务" v-if="this.taskType==='服务'">
              <a-select v-decorator="this.validator1.taskType">
                <a-select-option v-for="(item, key) of service"
                                 :value="item"
                                 :key='item'
                >{{item}}</a-select-option>
              </a-select>
            </a-form-item>-->
            <a-form-item label="服务URL" v-if="this.taskType==='服务'">
              <a-input v-decorator="this.validator1.url" placeholder="格式：http://ip:port/a/b/c"/>
            </a-form-item>
            <a-form-item label="请求类型" v-if="this.taskType==='服务'">
            <a-select  v-decorator="this.validator1.httpmethod" >
              <a-select-option value="HttpClientPost">
                Post
              </a-select-option>
              <a-select-option value="HttpClientGet">
                Get
              </a-select-option>
              <a-select-option value="HttpClientPut">
                Put
              </a-select-option>
              <a-select-option value="HttpClientUpdate">
                Update
              </a-select-option>
              <a-select-option value="HttpClientOptions">
                Options
              </a-select-option>
              <a-select-option value="HttpClientPatch">
                Patch
              </a-select-option>
              <a-select-option value="HttpClientDelete">
                Delete
              </a-select-option>
            </a-select>
          </a-form-item>
            <a-form-item label="请求参数" v-if="this.taskType==='服务'">
              <a-input v-decorator="this.validator1.parameters" placeholder="格式：参数1#数据1|参数2#数据2|......"/>
            </a-form-item>
            <a-form-item label="预期结果" v-if="this.taskType==='服务'">
              <a-input v-decorator="this.validator1.expectedResult"/>
            </a-form-item>
            <a-form-item label="任务时间">
              <a-range-picker v-decorator="this.validator1.frontyear"/>
            </a-form-item>

          </a-form>
        </a-tab-pane>
      </a-tabs>
    </a-modal>
  </div>
</template>

<script>
import aModal from "@/common/modal"
import modal from "./flowModal"
import {
  ADDESTIMATETASK,
  ADDPRODUCTTASK,
  GETALLSERVICE,
  REGIONTREE,
  UPLOADESTIMATE,
  UPLOADPRODUCT,
  GETFLOWDATA
} from '@/../static/js/apis.js'
import {
  estimateTaskForm1,
  estimateTaskForm2,
  estimateTaskForm3,
} from "@/../static/js/formValidators.js"
import global from "@/../static/global.vue"
import {TreeSelect} from 'ant-design-vue';
const SHOW_PARENT=TreeSelect.SHOW_PARENT
export default{
  inject:['reload'],                                 //注入App里的reload方法
  name: "taskModal",
  props: ['title', 'visible'],
  components: {
    aModal,
    modal
  },
  data () {
    return {
      formItemLayout: {
        labelCol: { span: 6 },
        wrapperCol: { span: 14 },
      },
      taskType:'数据',
      validator1: estimateTaskForm1,
      fileAction: UPLOADPRODUCT.url,   //导入文件提交路径
      estimateFileAction:UPLOADESTIMATE.url,
      service: [],
      userid:'',
      uploadParam:{},
      treeData:{},
      area:[],
      see:false,
      SHOW_PARENT
    }
  },
  beforeCreate() {
    this.form2 = this.$form.createForm(this, { name: 'estimateTaskForm' });
  },
  computed: {
    headers () {
      return {
        "token" : localStorage.getItem("token")
      }
    }
  },
  methods: {

    getStaticData () {
      let self=this
      GETALLSERVICE('',function(res){
        self.service = res
      })
      REGIONTREE('',function(res){
        console.log(res)
        self.treeData = res.obj
      })
      self.userid=parseInt(localStorage.getItem("userid"))
      self.uploadParam={
        userid:self.userid
      }


    },
    handleUploadChange(info) {
      if (info.file.status === 'done') {
        this.$message.success(`${info.file.name} 上传成功`);
      } else if (info.file.status === 'error') {
        this.$message.error(`${info.file.name} 上传失败`);
      }
    },
    ok(e) {
      let self=this;
      e.preventDefault();

        if (self.taskType === "数据") {
          self.validator1 = estimateTaskForm1
        } else if (self.taskType === "应用") {
          self.validator1 = estimateTaskForm2
        } else if (self.taskType === "服务") {
          self.validator1 = estimateTaskForm3
        }
        self.form2.validateFields((err, values) => {
          if (!err) {
            values.frontyear = [values.frontyear[0].format('YYYY-MM-DD'), values.frontyear[1].format('YYYY-MM-DD')]
            values.demandId = self.demandId
            values.userid = self.userid
            ADDESTIMATETASK(values, function (res) {
              if (res.code == '200') {
                self.$message.success(res.message);
                self.form2.resetFields();
                self.$emit("cancel", e)
                localStorage.setItem("activeIndex", '2');
                self.$router.push({path: '/taskManagement', query: {system: '业务管理'}})
                self.$store.commit('changeFirstNavSelected', '2')
                self.reload()
              } else {
                self.$message.error(res.message);
              }
            })
          }
        });



    },
    /*关闭modal*/
    cancel(e) {
      this.form2.resetFields();
      this.see = false;
      this.$emit("cancel", e);
      // self.see=false;
    },
    handleChange(value) {
      let self = this
      self.taskType = value
      if (self.taskType === "数据") {
        self.validator1 = estimateTaskForm1
      } else if (self.taskType === "应用") {
        self.validator1 = estimateTaskForm2
      } else if (self.taskType === "服务") {
        self.validator1 = estimateTaskForm3
      }
    }

  },
  created() {
    this.getStaticData()
    var jsonData={}
    jsonData=JSON.stringify(jsonData)
    localStorage.setItem("flowJson", jsonData)
  },

}
</script>

<style scoped>

</style>
